<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <!-- 避免IE使用兼容模式 -->
    <meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
    <meta name="renderer" content="webkit">
    <link type="text/css" href="/static/public/css/font.css" rel="stylesheet"/>
    <link type="text/css" href="/static/public/css/main.css" rel="stylesheet"/>
    <!-- TopJUI框架样式 -->
    <!--<link type="text/css" href="/topjui/themes/default/topjui.core.min.css" rel="stylesheet">
    <link type="text/css" href="/topjui/themes/default/topjui.blue.css" rel="stylesheet" id="dynamicTheme"/>-->
    <!-- FontAwesome字体图标 -->
    <link type="text/css" href="/static/plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet"/>
    <!-- layui框架样式 -->
    <link type="text/css" href="/static/plugins/layui/css/layui.css" rel="stylesheet"/>
    <!-- jQuery相关引用 -->
    <script type="text/javascript" src="/static/plugins/jquery/jquery.min.js"></script>
    <script type="text/javascript" src="/static/plugins/jquery/jquery.cookie.js"></script>
    <!-- TopJUI框架配置 -->
    <script type="text/javascript" src="/static/public/js/topjui.config.js"></script>
    <!-- TopJUI框架核心-->
    <script type="text/javascript" src="/topjui/js/topjui.core.min.js"></script>
    <!-- TopJUI中文支持 -->
    <script type="text/javascript" src="/topjui/js/locale/topjui.lang.zh_CN.js"></script>
    <!-- layui框架js -->
    <script src="/static/plugins/layui/layui.js" charset="utf-8"></script>
    <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=lqVkw7DAWGt8CA9NAzxGWrQq"></script>
    <style>
        body {
            margin: 10px;
        }

        blockquote p {
            padding: 5px;
        }

        .layui-table {
            margin-top: 0 !important;
        }

        .layui-elem-quote {
            margin-bottom: 0 !important;
        }

        .layui-table {
            margin-top: 0;
            border-left: 5px solid #e2e2e2 !important;
        }

        .title .icon-new1 {
            margin-left: 10px;
            color: #f00;
        }
        html,body,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}
        /*地图标题*/
        .BMap_bubble_title {
            color:white;
            font-size:13px;
            font-weight:bold;
            text-align:left;
            padding-left:5px;
            padding-top:5px;
            border-bottom:1px solid gray;
            background-color:#0066b3;
        }
        /* 消息内容 */
        .BMap_bubble_content {
            background-color:white;
            padding-left:5px;
            padding-top:5px;
            padding-bottom:10px;
        }
        /* 内容 */
        .BMap_pop div:nth-child(9) {
            top:35px !important;
            border-radius:7px;
        }
        /* 左上角删除按键 */
        .BMap_pop img {
            top:46px !important;
            left:250px !important;
        }
        .BMap_top {
            display:none;
        }
        .BMap_bottom {
            display:none;
        }
        .BMap_center {
            display:none;
        }
        /* 隐藏边角 */
        .BMap_pop div:nth-child(1) div {
            display:none;
        }
        .BMap_pop div:nth-child(5) {
            display:none;
        }
        .BMap_pop div:nth-child(3) {
            display:none;
        }
        .BMap_pop div:nth-child(7) {
            display:none;
        }

        ul#navv {
            list-style-type: none;
            padding: 0;
            margin: 0;
        }
        #navv li.a {
            display: block;
            width: 220px;
            padding-left: 20px;
            margin-top:10px ;
            font: bold 80% Arial, Helvetica, sans-serif;
            color: #271313;
            background: url("/img/map/a16.png") top left no-repeat;
            text-decoration: none;
        }
        #navv li.b {
            display: block;
            width: 220px;
            padding-left: 20px;
            margin-top:10px ;
            font: bold 80% Arial, Helvetica, sans-serif;
            color: #271313;
            background: url("/img/map/b16.png") top left no-repeat;
            text-decoration: none;
        }
        #navv li.c {
            display: block;
            width: 220px;
            padding-left: 20px;
            margin-top:10px ;
            font: bold 80% Arial, Helvetica, sans-serif;
            color: #271313;
            background: url("/img/map/c16.png") top left no-repeat;
            text-decoration: none;
        }
        #navv li.d {
            display: block;
            width: 220px;
            padding-left: 20px;
            margin-top:10px ;
            font: bold 80% Arial, Helvetica, sans-serif;
            color: #271313;
            background: url("/img/map/d16.png") top left no-repeat;
            text-decoration: none;
        }
        #navv li.e {
            display: block;
            width: 220px;
            padding-left: 20px;
            margin-top:10px ;
            font: bold 80% Arial, Helvetica, sans-serif;
            color: #271313;
            background: url("/img/map/e16.png") top left no-repeat;
            text-decoration: none;
        }
        #navv li.f {
            display: block;
            width: 220px;
            padding-left: 20px;
            margin-top:10px ;
            font: bold 80% Arial, Helvetica, sans-serif;
            color: #271313;
            background: url("/img/map/f16.png") top left no-repeat;
            text-decoration: none;
        }

        ul#czd {
            list-style-type: none;
            padding: 0;
            margin: 0;
        }
        #czd li.a {
            display: block;
            width: 220px;
            padding-left: 20px;
            margin-top:10px ;
            font: bold 80% Arial, Helvetica, sans-serif;
            color: #271313;
            background: url("/img/map/a16.png") top left no-repeat;
            text-decoration: none;
        }
        #czd li.b {
            display: block;
            width: 220px;
            padding-left: 20px;
            margin-top:10px ;
            font: bold 80% Arial, Helvetica, sans-serif;
            color: #271313;
            background: url("/img/map/b16.png") top left no-repeat;
            text-decoration: none;
        }
        #czd li.c {
            display: block;
            width: 220px;
            padding-left: 20px;
            margin-top:10px ;
            font: bold 80% Arial, Helvetica, sans-serif;
            color: #271313;
            background: url("/img/map/c16.png") top left no-repeat;
            text-decoration: none;
        }
        #czd li.d {
            display: block;
            width: 220px;
            padding-left: 20px;
            margin-top:10px ;
            font: bold 80% Arial, Helvetica, sans-serif;
            color: #271313;
            background: url("/img/map/d16.png") top left no-repeat;
            text-decoration: none;
        }
        #czd li.e {
            display: block;
            width: 220px;
            padding-left: 20px;
            margin-top:10px ;
            font: bold 80% Arial, Helvetica, sans-serif;
            color: #271313;
            background: url("/img/map/e16.png") top left no-repeat;
            text-decoration: none;
        }
        #czd li.f {
            display: block;
            width: 220px;
            padding-left: 20px;
            margin-top:10px ;
            font: bold 80% Arial, Helvetica, sans-serif;
            color: #271313;
            background: url("/img/map/f16.png") top left no-repeat;
            text-decoration: none;
        }
        .anchorBL {
            display: none;
        }

    </style>
</head>

<body>

    <div id="allmap"></div>


</body>
</html>
<script type="text/javascript">
    // 百度地图API功能
    var map = new BMap.Map("allmap");    // 创建Map实例

    map.centerAndZoom("泰州", 11);  // 初始化地图,设置中心点坐标和地图级别
    //添加地图类型控件
    map.addControl(new BMap.MapTypeControl({
        mapTypes:[
            BMAP_NORMAL_MAP,
            BMAP_HYBRID_MAP
        ]}));
//    map.setMapStyle({
//        style:"light"
//    });
    map.setMapStyle({
        styleJson:[

                {
                    "featureType": "land",
                    "elementType": "geometry",
                    "stylers": {
                        "color": "#e7f4f8ff"
                    }
                },
                {
                    "featureType": "green",
                    "elementType": "all",
                    "stylers": {
                        "color": "#d9ead3ff"
                    }
                },
                {
                    "featureType": "highway",
                    "elementType": "geometry.fill",
                    "stylers": {
                        "color": "#ccccccff"
                    }
                },
                {
                    "featureType": "highway",
                    "elementType": "geometry.stroke",
                    "stylers": {
                        "color": "#999999ff"
                    }
                },
                {
                    "featureType": "arterial",
                    "elementType": "geometry.fill",
                    "stylers": {
                        "color": "#ccccccff"
                    }
                },
                {
                    "featureType": "arterial",
                    "elementType": "geometry.stroke",
                    "stylers": {
                        "color": "#ccccccff"
                    }
                },
                {
                    "featureType": "local",
                    "elementType": "labels.text.fill",
                    "stylers": {
                        "color": "#eeeeeeff"
                    }
                },
                {
                    "featureType": "local",
                    "elementType": "labels.text.stroke",
                    "stylers": {
                        "color": "#d6e4e5"
                    }
                },
                {
                    "featureType": "arterial",
                    "elementType": "labels.text.fill",
                    "stylers": {
                        "color": "#374a46"
                    }
                },
                {
                    "featureType": "highway",
                    "elementType": "labels.text.fill",
                    "stylers": {
                        "color": "#374a46"
                    }
                },
                {
                    "featureType": "water",
                    "elementType": "geometry.fill",
                    "stylers": {
                        "color": "#96b5d6"
                    }
                },
                {
                    "featureType": "boundary",
                    "elementType": "geometry",
                    "stylers": {
                        "color": "#0c343dff"
                    }
                },
                {
                    "featureType": "highway",
                    "elementType": "geometry.stroke",
                    "stylers": {
                        "color": "#e4f2f6ff"
                    }
                }

        ]
    });

    var taskMap = [];
    var carMap = [];
    var roomMap=[];

    var myIconD = new BMap.Icon('/img/map/d24.gif',new BMap.Size(24,24));
    var myIconP = new BMap.Icon('/img/map/p24.gif',new BMap.Size(24,24));

    var myIcon10 = new BMap.Icon('/img/map/w18.gif',new BMap.Size(18,18));
    var myIcon20 = new BMap.Icon('/img/map/g32.gif',new BMap.Size(32,32));
    var myIcon30 = new BMap.Icon('/img/map/x32.gif',new BMap.Size(32,32));
    var myIcon40 = new BMap.Icon('/img/map/q32.gif',new BMap.Size(32,32));
    var myIcon50 = new BMap.Icon('/img/map/x32.gif',new BMap.Size(32,32));
    var myIcon60 = new BMap.Icon('/img/map/c32.gif',new BMap.Size(32,32));
    var myIcon70 = new BMap.Icon('/img/map/k32.gif',new BMap.Size(32,32));
    var myIcon80 = new BMap.Icon('/img/map/q32.gif',new BMap.Size(32,32));
    var myIcon90 = new BMap.Icon('/img/map/x32.gif',new BMap.Size(32,32));

    var carIcon = new BMap.Icon('/img/map/car.png',new BMap.Size(80,56));
    map.setCurrentCity("泰州");          // 设置地图显示的城市 此项是必须设置的
    map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放


</script>